.pagination li {
            line-height: 20px;
            list-style: none;
            float: left;
        }

.pagination .active a {
    background-color: #30b6d7;
}

#search{
    position: relative;
    height: auto;
    padding-bottom: 20px;
    margin-bottom: 20px;
    padding-left: 10px;
    padding-top: 10px;
    border-radius: 5px;
    border: 1px solid #80808036;
    display: flex;
    flex-wrap:wrap;
}

#search input ,#search select{
    width: 20%;
    border: 0;
    padding-bottom: 4px;
    border-bottom: 1px solid;
    border-bottom-color: #cccccc;
    outline: none;
    text-align: left;
    overflow: hidden;
    margin-left: 8px;
}

#search > label{
    width: 11%;
    text-align: right;
    line-height: 34px;
}
#search .btn_area{
    display: inline-block;
    text-align: center;
    width: 100%;
    max-width: 1100px;
    height: 38px;
    margin-top: 12px;
}
#search .btn_area button{
    border-color:#65a9f2;
    cursor:pointer;
    text-align:center;
    width:77px;
    height:33px;
    line-height:28px;
    border-radius:5px;
    color:#fff;
    border:1px solid;
}
#search_down{
    background-color:#65a9f2!important;
}

.show-true{
  display:inherit
}

.show-false{
   display:none
}

.content-head {
    font-weight: bold;
    padding: 10px;
 }

 .datagrid{
   width: 100%;
 }

 input[readonly='readonly']{
     background-color: white!important;
     border: 1px solid #cfdde8;
     border-radius: 5px;
 }

 button.active{
       border: 1px solid blue!important;
       color: blue!important;
 }